<template>
	<view class="zdex9">
		<view class="flex aliend w100b fixed bgfff zdex9 bdr1_top boree"
			:style="{'bottom':safeAreaBottom.safeAreaInsets.bottom +'rpx'}">
			<view class="flex1 txtcen" @click="navswitch('/pages/index/index')">
				<image class="w60 h60 ius20"
					:src="currentRoute.indexOf('index') > -1? cosImageUrl('home.png',true):cosImageUrl('home_active.png',true)"
					mode="aspectFit"></image>
				<view class="fz24" :class="currentRoute.indexOf('index') > -1 ?'colff0814':''">首页</view>
			</view>
			<view class="flex1 txtcen" @click="navswitch('/pages/expert/expert')">
				<image class="w60 h60 ius20"
					:src="currentRoute.indexOf('expert') > -1? cosImageUrl('expert_active.png',true):cosImageUrl('expert.png',true)"
					mode="aspectFit"></image>
				<view class="fz24" :class="currentRoute.indexOf('expert') > -1 ?'colff0814':''">专家</view>
			</view>
			<view class="flex1 txtcen" @click="navswitch('/pages/keFuservice/keFuservice')">
				<image class="w60 h60 ius20"
					:src="currentRoute.indexOf('keFuservice') > -1? cosImageUrl('kefu_active.png',true):cosImageUrl('kefu.png',true)"
					mode="aspectFit"></image>
				<view class="fz24" :class="currentRoute.indexOf('keFuservice') > -1 ?'colff0814':''">客服</view>
			</view>
			<image v-if="showVip" class="w120 h120" @click="goopenVip()" :src="cosImageUrl('/vipLogo.png',true)"
				mode="aspectFit">
			</image>
			<view class="flex1 txtcen" @click="gomine()">
				<image class="w60 h60 ius20"
					:src="currentRoute.indexOf('mine') > -1?cosImageUrl('my.png',true):cosImageUrl('my_active.png',true)"
					mode="aspectFit"></image>
				<view class="fz24" :class="currentRoute.indexOf('mine') > -1 ?'colff0814':''">个人中心</view>
			</view>
		</view>
		<view class="bgfff w100b fixed b0" :style="{ 'height': `${safeAreaBottom.safeAreaInsets.bottom}` +'px'}">
		</view>
	</view>
</template>

<script>
	export default {
		name: "tabbar",
		data() {
			return {
				defaultValue: 1,
				tabbarList: [{
						"text": "首页",
						"iconPath": "/static/tabbar/icon-nav0.png",
						"selectedIconPath": "/static/tabbar/icon-nav0-cur.png",
						"pagePath": "/pages/index/index"
					},
					{
						"text": "我的信息",
						"iconPath": "/static/tabbar/icon-nav3.png",
						"selectedIconPath": "/static/tabbar/icon-nav3-cur.png",
						"pagePath": "/pages/mine/mine"
					}
				]
			};
		},
		watch: {
			'$store.state.tabbarValue': {
				handler(newValue, oldValue) {
					this.defaultValue = newValue
				},
				immediate: true
			}
		},
		created() {
			let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
			this.currentRoute = routes[routes.length - 1].route //获取当前页面路由
			uni.hideTabBar();
		},
		methods: {
			change(index) {
				this.defaultValue = index
				this.$store.commit('setTabbarValue', index)
				let url = this.tabbarList[index].pagePath
				uni.navigateTo({
					url: url
				})
			},
			goopenVip() {
				if (!this.readData('useId')) {
					this.showMsg('请先登录')
					return this.navLaunch('/pages/login/login')
				}
				this.navgateTo('/pages/openvip/openvip')
			},
			gomine() {
				this.$emit('gomine')
			}
		}
	}
</script>

<style lang="less">
	.u-page__item__slot-icon {
		width: 24px;
		height: 24px;
	}
</style>